<template>
  <div>
    <el-input v-model="userName" size="small" placeholder="请输入教师名" @keydown.enter="$refs.tableRef.request({ userName })" />
    <cus-table ref="tableRef" url="/prepareConfigGroup/queryUsers" :init="{ courseId }"  @selection-change="checkChange">
      <el-table-column type="selection" width="80" />
      <el-table-column prop="nickname" label="教师姓名" width="140"/>
      <el-table-column prop="mobile" label="手机号" width="140"/>
      <el-table-column prop="schoolNames" show-overflow-tooltip label="所属校区" width="300"/>
    </cus-table>
  </div>
</template>

<script lang="ts">
import { ref } from 'vue'
import { useState } from '$'
export default {
  props: [ 'courseId' ],
  setup() {
    let userName = ref(null);

    let [ ids, setIds ] = useState([]);

    const checkChange = (nodes) => {
      let ids = nodes.map(n => n.id);
      setIds(ids);
    }

    const save = (resolve) => {
      resolve(ids.value);
    }
    return { checkChange, userName, save }
  }
}
</script>

<style lang="scss" scoped>
.el-input {
  margin-bottom: 15px;
}
</style>